<template>
	<!-- 必到-首页 -->
	<view>
		<!-- 导航 -->
		<view>
			<u-navbar back-text="全部家政人员" :border-bottom="false" :back-text-style="textStyle" back-icon-color="#000000" style="font-weight: bold;font-family: PingFang SC;"></u-navbar>
		</view>
		<mescroll-body top="0" :down="downOption" :up="upOption" :height="comHeight" ref="mescrollRef" :fixed="true" 
		 :topbar="false" bottom="0" :bottombar="true" :safearea="false" @init="mescrollInit" @down="downCallback">
			<view class="wrap">
				<view class="lits" v-for="(item,index) in entList" :key="index" @click="pepoleDetails(item.portrait,item.name,item.workExperience,item.business,item.score,item.employeeId,item.serviceType)">
					<image :src="item.portrait" mode="aspectFill"></image>
					<view style="margin-left: 16rpx;">
						<view>
							<text class="name">{{item.name}}</text>
							<!-- <text class="exprience">{{item.workExperience}}年工作经验</text> -->
						</view>
						<view class="goodAt">
							<view class="goods">
								擅长
							</view>
							<view class="have">
								<view v-for="(ite,ind) in item.business" style="padding-right: 10rpx;">{{ite}}</view>
							</view>
						</view>
					</view>
				</view>
				<view style="margin-top: 50rpx;" v-if="!showList||entList.length==0">
					<u-divider color="#DEDEDE" half-width="120" border-color="#DEDEDE">{{prompt}}</u-divider>
				</view>
			</view>
		</mescroll-body>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				count: 5,
				value: 4.85,
				textStyle: {
					color: '#272755'
				},
				enterpriseId: "",
				entList: [],
				page: 1,
				pageSize: 10,
				prompt: '加载中....',
				showList: false,
				totalPage: 1,
				// 下拉刷新配置
				downOption: {
					use: true,
					auto: false,
					offset: 40
				},
				upOption: {
					use: true,
					auto: false
				},
				mescroll: null,
				comHeight: 0
			}
		},
		onReachBottom() {
			if (this.totalPage == this.page) {
				return false;
			} else {
				this.page += 1;
				this.getentList();
			}
		},
		onLoad(option) {
			var that = this;
			var menuButtonInfo = uni.getMenuButtonBoundingClientRect();
			const {
				top,
				width,
				height,
				right
			} = menuButtonInfo;
			uni.getSystemInfo({
				success: res => {
					const {
						statusBarHeight
					} = res;
					const margin = top - statusBarHeight;
					var navHeight = height + statusBarHeight + margin * 4;
					that.comHeight = res.windowHeight - navHeight + 'px';
				}
			});
			that.enterpriseId = option.enterpriseId
			that.getentList();
		},
		methods: {
			mescrollInit(mescroll) {
				this.mescroll = mescroll;
			},
			// 下拉刷新回调函数
			downCallback() {
				setTimeout(() => {
					this.mescroll.endSuccess();
					this.page = 1;
					this.entList = [];
					this.prompt = '加载中....';
					this.getentList();
				}, 2000);
			},
			// 获取员工列表
			getentList() {
				var _this = this
				let opts = {
					way: true, //true JSON请求；false 表单请求
					method: 'post',
					url: 'employee/entList',
				};
				let data = {
					page: _this.page,
					pageSize: _this.pageSize,
					entId: _this.enterpriseId
				};
				_this.http.httpTokenRequest(opts, data).then(res => {
					if (res.code = 200) {
						_this.totalPage = res.data.pages;
						if (res.data.records.length > 0 || _this.page != 1) {
							_this.showList = false;
							if (res.data.current * res.data.size < res.data.total) {
								for (const key in res.data.records) {
									_this.entList.push(res.data.records[key]);
								}
								_this.prompt = '加载中....';
							} else {
								for (const key in res.data.records) {
									_this.entList.push(res.data.records[key]);
								}
								_this.prompt = '没有更多了';
							}
						} else {
							_this.showList = true;
							_this.prompt = '没有更多了';
							_this.entList = []
						}
					} else {
						_this.$refs.uToast.show({
							title: res.message,
							type: 'error'
						})
					}
				})
			},
			// 家政人员详情
			pepoleDetails(portrait, name, workExperience, business, score,employeeId,serviceType) {
				if(serviceType == 1){
					uni.navigateTo({
						url:'../../matching/hisResume/hisResume?employeeId=' + employeeId + '&redirectId=' + business +'&imgs='+portrait +
						'&addType=2'
					})
				}else{
					uni.navigateTo({
						url: '../pepoleDetails/pepoleDetails?portrait=' + portrait + '&name=' + name +
							'&workExperience=' + workExperience + '&business=' + business + '&score=' + score
					});
				}
			}
		}
	};
</script>

<style scoped lang="scss">
	.wrap {
		padding: 0 26rpx 10rpx 28rpx;
	}

	.lits {
		margin-top: 44rpx;
		display: flex;
	}

	.lits image {
		width: 104rpx;
		height: 104rpx;
		border-radius: 50%;
	}

	.name {
		color: #7A7A7A;
		font-size: 30rpx;
		font-weight: bold;
	}

	.exprience {
		color: #F29423;
		font-size: 22rpx;
		border-radius: 5px 0px 5px 0px;
		border: 1px solid #F29423;
		background: #FFF2D9;
		text-align: center;
		padding: 2rpx 20rpx;
		margin-left: 16rpx;
	}

	.goodAt {
		display: flex;
		font-size: 26rpx;
		margin-top: 10rpx;
	}

	.goods {
		color: #9393AA;
	}

	.have {
		width: 508rpx;
		color: #707070;
		margin-left: 16rpx;
		font-family: PingFang SC;
		display: flex;
		flex-wrap: wrap;
	}
</style>
